<%-- 
    Document   : frm-cambiacontrasenia
    Created on : 02-ago-2013, 19:44:28
    Author     : pavel
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Cambiar contrase&ncaron;a</title>
        <link rel="stylesheet" type="text/css" href="/sisagua/css/login.css">
        <link rel="stylesheet" type="text/css" href="/sisagua/css/style-fomularios.css" media="all">
        <link rel="stylesheet" href="/sisagua/css/style.css" type="text/css" charset="utf-8"/>
    </head>    
    <body>
<!----   empieza aqui!-->
        <div class="content">
            <!-- The activator -->
            <a class="activator" id="activator"></a>
        </div>
<!--
        <div class="footer">
            <a class="back" href="#"></a>
        </div>
!-->
        <!-- The overlay and the box -->
        <div class="overlay" id="overlay" style="display:none;"></div>
        <div class="box" id="box">
            <a class="boxclose" id="boxclose"></a>
            <h1>SUGERENCIA AL CAMBIAR NUEVA CONTRASE&Ncaron;A</h1>
            <p>
            <p style="color: #45709d; font-weight: bold; text-transform: uppercase">Primer paso</p>
            Ingresar el usuario.<br>
            <p style="color: #45709d; font-weight: bold; text-transform: uppercase">Segundo paso</p>
                Ingresar la contrase&ncaron;a anterior.<br>
            <p style="color: #45709d; font-weight: bold; text-transform: uppercase">Tercero paso</p>
                Ingresar la nueva clave.<br>
            <p style="color: #45709d; font-weight: bold; text-transform: uppercase">Cuarto paso</p>
                Repetir la nueva clave.<br>
            </p>
        </div>
<!----   temrina aqui!-->        
        
        
            <form name="Formulario-Usuario" action="${pageContext.request.contextPath}/MantenimientoAcceso" method="POST" class="contacto">
                <table border="2px" name="formulario-tablaUsuario" class="margin">
                    <tr>
                        <td class="margin style-fuente" colspan="3">CAMBIAR CONTRASE&Ncaron;A</td>
                    </tr>
<tr>
    <td>
        <fieldset style="border: 1px solid #7f92a5">
            <legend style="border: 1px solid #7f92a5; background-color: #7f92a5;color: #ffffff">Validar Datos</legend>
        <table>
                    <tr>
                        <td><label>Usuario:</label></td>
                        <td class="margin"><input type="text" name="usu" class="text_input" value=""></td>
                    </tr>
                    <tr>
                        <td><label>Clave Anterior:</label></td>
                        <td class="margin"><input type="password" name="pasword" class="text_input" value=""></td>
                    </tr>
        </table>
        </fieldset>
  </td>
</tr>
<tr>
    <td>
        <fieldset style="border: 1px solid #7f92a5">
            <legend style="border: 1px solid #7f92a5; background-color: #7f92a5;color: #ffffff">Validar Nueva Contrase&ntilde;a</legend>
        <table>
                    <tr>
                        <td><label>Nueva Clave:</label></td>
                        <td class="margin"><input type="password" name="pas2" class="text_input" value=""></td>
                    </tr>
                    <tr>
                        <td><label>Retipa Clave:</label></td>
                        <td class="margin"><input type="password" name="pas3" class="text_input" value=""></td>
                    </tr>
        </table>
        </fieldset>
  </td>
</tr>
       </table>
    <div align="center">
        <button type="submit" value="actualizar" name="btn1" class="btn">Actualizar</button>
        <button type="reset" value="Limpiar" class="btn">Limpiar</button>
        <button type="button" value="Salir" onclick="window.close();" class="btn">Salir</button>
    </div>
    <div align="center"> 
        <%String msj=(String)request.getAttribute("msj");if(msj!=null){%>
        <label style="color: red;"><%=msj%></label><br><%}%>
    </div>
        </form>  
        
<script type="text/javascript" src="/sisagua/js/jquery-1.3.2.js"></script>
        <script type="text/javascript">
            $(function() {
                $('#activator').click(function(){
                    $('#overlay').fadeIn('fast',function(){
                        $('#box').animate({'top':'160px'},500);
                    });
                });
                $('#boxclose').click(function(){
                    $('#box').animate({'top':'-200px'},500,function(){
                        $('#overlay').fadeOut('fast');
                    });
                });

            });
        </script>
        
    </body>
</html>
